<div class="selectable-card is-rounded secondaries">
  <div class="level">
    <h3 class="card-title title is-5">{{replicationAttrs.secondaries.length}} Known Secondaries</h3>
    <ToolbarLink @params={{array "mode.secondaries" cluster.replicationMode}} data-test-manage-link>
      View all
    </ToolbarLink>
  </div>
  <div class="secondaries-table">
    {{#unless replicationAttrs.secondaries}}
      <EmptyState
        @title="No known {{cluster.replicationMode}} secondary clusters associated with this cluster"
        @message="Associated secondary clusters will be listed here. Add your first secondary cluster to get started." />
    {{else}}
      <KnownSecondariesTable @secondaries={{replicationAttrs.secondaries}} />
    {{/unless}}
  </div>
  {{#if cluster.canAddSecondary}}
    {{#link-to "mode.secondaries.add" cluster.replicationMode class="link add-secondaries"}}
      Add secondary
    {{/link-to}}
  {{/if}}
</div>

